<template>
	<div>
		<div class="vs-search-box">
			<el-descriptions v-if="beType != 2" title="" border :column="2">
				<el-descriptions-item label="出库单号">{{ number }}</el-descriptions-item>
				<el-descriptions-item :label="beType == 1 ? '关联要货单号' : '关联积分商城订单号'">
					{{ beType == 1 ? detail.row.number : ticket_code }}
					<el-button type="primary" size="small" @click="goDetail">查看详情</el-button>
				</el-descriptions-item>
				<el-descriptions-item label="入库类型">{{ beType | typeFilter }}</el-descriptions-item>
				<el-descriptions-item label="入库门店">{{ detail.row.store.title }}</el-descriptions-item>
				<el-descriptions-item label="入库时间">{{ detail.row.create_time }}</el-descriptions-item>
				<el-descriptions-item label="单据备注">
					{{ detail.row.remarks }}
				</el-descriptions-item>
			</el-descriptions>
			<el-descriptions v-else title="" border :column="2">
				<el-descriptions-item label="入库单号">{{ number }}</el-descriptions-item>
				<el-descriptions-item label="关联调拨单号">
					{{ ticket_code }}
					<el-button type="primary" size="small" @click="goDetail">查看详情</el-button>
				</el-descriptions-item>
				<el-descriptions-item label="入库门店">{{ detail.row.toStore.title }}</el-descriptions-item>
				<el-descriptions-item label="出库门店">{{ detail.row.fromStore.title }}</el-descriptions-item>
				<el-descriptions-item label="入库类型">{{ beType | typeFilter }}</el-descriptions-item>
				<el-descriptions-item label="商品类型">{{ detail.row.goods_type | typeFilter1 }}</el-descriptions-item>
			</el-descriptions>
		</div>
		<div class="vs-table-box">
			<el-table :data="detail.info" header-row-class-name="has-gutter-table" style="margin-top: 20px" show-summary border ref="multipleTable">
				<el-table-column prop="id" width="50" label="序号" align="center"></el-table-column>
				<template v-if="beType == 1">
					<el-table-column prop="goods.number" label="商品编码" align="center"></el-table-column>
					<el-table-column prop="goods.title" label="商品系列" align="center"></el-table-column>
					<el-table-column prop="blank_type_name" label="毛坯种类" align="center"> </el-table-column>
					<el-table-column prop="needle_type_name" label="递针类型" v-if="detail.row.two_type!=1" align="center"> </el-table-column>
					<el-table-column prop="size_name" label="尺寸" align="center"> </el-table-column>
					<el-table-column prop="sex_name" label="性别" v-if="detail.row.two_type!=1" align="center"> </el-table-column>
					<el-table-column prop="length_name" label="长度" v-if="detail.row.two_type!=1" align="center"> </el-table-column>
					<el-table-column prop="colour_name" label="颜色"  align="center"> </el-table-column>
					<el-table-column prop="quantity" label="要货数量" align="center">
						<template slot-scope="scope">
							<div v-if="scope.row.quantity">{{ scope.row.quantity }}</div>
							<div v-else>1</div>
						</template>
					</el-table-column>
					<el-table-column prop="price" v-if="utils.getIsShopowner()" label="要货金额" align="center"> </el-table-column>
				</template>
				<template v-if="beType == 3">
					<el-table-column prop="goods_integral_name" label="商品系列" align="center"></el-table-column>
					<el-table-column prop="goodsIntegral.sku_text" label="规格" align="center"></el-table-column>
					<el-table-column prop="number" label="入库数量" align="center"></el-table-column>
				</template>
				<template v-if="beType == 1">
					<el-table-column prop="tech_num" label="已入库数" align="center">
						<template slot-scope="scope">
							<div v-if="scope.row.store_stock_quantity">{{ scope.row.store_stock_quantity }}</div>
							<div v-else>1</div>
						</template>
					</el-table-column>
					<el-table-column prop="tech_num" label="待入库数" align="center">
						<template> 0 </template>
					</el-table-column>
					<el-table-column prop="remarks" label="备注" align="center"></el-table-column>
				</template>
				<template v-if="beType == 2">
					<el-table-column prop="number" label="商品编码" align="center"></el-table-column>
					<el-table-column prop="title" label="商品系列" align="center"></el-table-column>
					<template v-if="detail.row.goods_type == 1 || detail.row.goods_type == 2">
						<el-table-column prop="roughcast" label="毛坯种类" align="center"> </el-table-column>
						<el-table-column prop="needle" label="递针类型" align="center"> </el-table-column>
						<el-table-column prop="size" label="尺寸" align="center"> </el-table-column>
						<el-table-column prop="sex" label="性别" align="center"> </el-table-column>
						<el-table-column prop="length" label="长度" align="center"> </el-table-column>
						<el-table-column prop="colour" label="颜色" align="center"> </el-table-column>
					</template>
					<template v-else>
						<el-table-column prop="sku_text" label="规格" align="center"></el-table-column>
						<el-table-column prop="unit" label="单位" align="center"></el-table-column>
					</template>
					<el-table-column prop="price" label="调拨数量" align="center"></el-table-column>
					<el-table-column prop="count" v-if="utils.getIsShopowner()" label="调拨金额" align="center"></el-table-column>
				</template>
			</el-table>
			<el-descriptions border :column="4" style="margin-top: 20px" title="操作信息">
				<template v-if="beType == 1">
					<el-descriptions-item label="快递公司">{{ detail.logistics.company }}</el-descriptions-item>
					<el-descriptions-item label="快递单号">{{ detail.logistics.number }}</el-descriptions-item>
					<el-descriptions-item label="发货时间">{{ detail.logistics.create_time }}</el-descriptions-item>
				</template>
				<el-descriptions-item label="入库日期">{{ create_time }}</el-descriptions-item>
			</el-descriptions>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				type: 1, //1详情  2新增
				beType: 1, //入库类型   1要货入库 2调拨入库  3积分商品入库
				detail: {
					row: {
						store: {},
						toStore: {},
						fromStore: {},
					},
					logistics: [],
					info: [],
				},
				ticket_code: '',
				number: '',
				create_time: '',
			};
		},
		created() {
			let { type, ticket_code, number, create_time } = this.$route.query;
			this.beType = type;
			this.ticket_code = ticket_code;
			this.number = number;
			this.create_time = create_time;
			this.$route.meta.title = '入库单详情';
			this.getDetail({ type, ticket_code });
		},
		filters: {
			typeFilter(val) {
				let arr = ['', '要货入库', '调拨入库', '积分商品入库'];
				return arr[val];
			},
			typeFilter1(val) {
				let arr = ['', '毛坯', '成品', '积分商品', '洗护用品', '其他'];
				return arr[val];
			},
		},
		methods: {
			goDetail() {
				if (this.beType == 1) {
					this.utils.goUrl('/demandInfoTwo?id=' + this.detail.row.id);
				} else if (this.beType == 2) {
					this.utils.goUrl(`/goodsAllotInfo?id=${this.detail.row.id}`);
				} else {
					this.utils.goUrl('/orderInfos?id=' + this.detail.row.id);
				}
			},
			async getDetail(parms) {
				let { code, data } = await this.$Http.instockInfo(parms);
				if (code) {
					console.log(data);
					this.detail = data;
					if (data.logistics && data.logistics.length) {
						this.detail.logistics = data.logistics[0] || {};
					}
					console.log(this.detail.info);
				}
			},
		},
	};
</script>

<style leng="scss" scoped>
	.status {
		font-size: 18px;
		cursor: default;
	}
</style>
